<template>
    <component :is="currentView" />
</template>

<script setup lang="ts">
import { ref, computed } from 'vue'
import Home from './views/Home.vue'
import PackingForm from './views/PackingForm.vue'
import UnPackingForm from './views/UnPackingForm.vue'
const routes = {
  '/': Home,
  '/packing': PackingForm,
  '/unpacking': UnPackingForm,
}
const currentPath = ref(window.location.hash)
window.addEventListener('hashchange', () => {
  currentPath.value = window.location.hash
})
const currentView = computed(() => {
  return routes[currentPath.value.slice(1) || '/'] || Home
})
</script>